import router from '@/router'
import state from '@/store'
import nprogress from 'nprogress'
import 'nprogress/nprogress.css'

const whiteList = ['/login', '/404'] // 路由白名单

// 路由前置守卫
// to 要跳转的路由信息 to.path
// form 从哪跳转的路由信息
// next(地址) 要跳转的地址 next() 默认放行
router.beforeEach(async(to, from, next) => {
  nprogress.start() // 开启进度条
  //   判断是否有token
  if (state.getters.token) {
    if (to.path === '/login') {
      next('/')
    } else {
      // 在有token的情况下判断本地是否有用户信息(防止多次跳转重复调用接口)
      if (!state.getters.userId) { // 调用user模块下 userInfo方法
        const { roles } = await state.dispatch('user/userInfo') // 加await后面代码都是异步，不获取到数据不会跳转
        // 获取用户信息后 调用方法判断 此用户权限标识是否和 动态路由的定义名字一致(一致标识此用户有此权限)
        const result = await state.dispatch('permission/filterRoutes', roles.menus)
        console.log(roles.menus)
        console.log(result)
        // 404 页面一定要放到路由最后面， 否则会出现刷新进入404页面的情况
        router.addRoutes([...result, { path: '*', redirect: '/404', hidden: true }]) // 将动态路由添加到路由表中
        next(to.path) // 跳到登录页在跳进来
      } else {
        next()
      }
    }
    // 如果没有token
  } else {
    // 判断页面是否在跳转白名单
    if (whiteList.some(item => item === to.path)) {
      next()
    } else {
      next('/login')
    }
  }
  nprogress.done() // 解决手动切换地址时 进度条不关闭的问题
})

// 路由后置守卫
router.afterEach(() => {
  nprogress.done() // 关闭进度条
})
